<!-- xuwencheng  2022年6年29日18:00  这是我的wenzhangbianji -->
<!-- 编辑 -->
<template>
  <el-dialog
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :destory-on-close="true"
    :modal-append-to-body="false"
    :title="title"
    :visible.sync="dialogFormVisible"
    width="65%"
    @close="close"
  >
    <vab-query-form>
      <vab-query-form-left-panel :span="18">
        <el-form :inline="true" :model="queryForm" @submit.native.prevent>
          <el-form-item>
            <el-button type="primary" @click="handleDownload">
              导出全部 Excel
            </el-button>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="handleDownloadtwo">
              导出选中行
            </el-button>
          </el-form-item>
        </el-form>
      </vab-query-form-left-panel>
      <vab-query-form-right-panel :span="6" />
    </vab-query-form>
    <el-table
      ref="multipleTable"
      v-loading="listLoading"
      border
      :data="list"
      @selection-change="handleSelectionChange"
    >
      <el-table-column align="center" show-overflow-tooltip type="selection" />

      <el-table-column
        align="center"
        label="id"
        prop="id"
        show-overflow-tooltip
      />
      <el-table-column align="center" label="姓名" show-overflow-tooltip>
        <template #default="{ row }">
          {{ row.leaName }}
        </template>
      </el-table-column>

      <el-table-column
        align="center"
        label="领队经济人名称"
        show-overflow-tooltip
      >
        <template #default="{ row }">
          {{ row.leaNickName }}
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="所属协作公司"
        show-overflow-tooltip
      >
        <template #default="{ row }">
          {{ row.ofEnterprise }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="创建时间" show-overflow-tooltip>
        <template #default="{ row }">
          {{ row.createTime }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="企业/个人" show-overflow-tooltip>
        <template #default="{ row }">
          <template v-if="row.authEnterprise == 0">
            <span style="color: red">个人</span>
          </template>
          <template v-else-if="row.authEnterprise == 1">
            <span style="color: green">企业</span>
          </template>
        </template>
      </el-table-column>
      <el-table-column align="center" label="审核状态" show-overflow-tooltip>
        <template slot-scope="scope">
          <template v-if="scope.row.leaderApplyCheck == 0">
            <span style="color: red">未审核</span>
          </template>
          <template v-else-if="scope.row.leaderApplyCheck == 1">
            <span style="color: green">审核成功</span>
          </template>
          <template v-else-if="scope.row.leaderApplyCheck == 2">
            <span style="color: red">审核未通过</span>
          </template>
        </template>
      </el-table-column>

      <el-table-column
        align="center"
        label="操作"
        show-overflow-tooltip
        width="130"
      >
        <template #default="{ row }">
          <!-- <el-button type="text" @click="handleEdit(row)">编辑</el-button>
          <el-button type="text">停用</el-button> -->
          <el-button type="text" @click="handleEdittwo(row)">处理</el-button>
        </template>
      </el-table-column>
      <template #empty>
        <el-image
          class="vab-data-empty"
          :src="require('@/assets/empty_images/data_empty.png')"
        />
      </template>
    </el-table>
    <Edittwo ref="Edittwo" />
    <!-- <el-button class="baocun" size="medium" type="primary" @click="save">
      保存
    </el-button> -->
  </el-dialog>

  <!-- 增加 -->
</template>

<script>
  /* eslint-disable*/
  import { getlingduiList, jilu } from '@/api/userManagement'

  import Edittwo from './lingduichuli.vue'
  // import { roleId } from '@/api/yanyuan' //引入角色内容

  //import { number } from 'echarts'
  export default {
    name: 'search',
    components: { Edittwo },
    data() {
      return {
        multipleSelection: [],
        listLoading: true,
        options1: [
          {
            id: 0,
            creClasName: '未审核',
          },
          {
            id: 1,
            creClasName: '审核通过',
          },
          {
            id: 2,
            creClasName: '审核未通过',
          },
        ],
        layout: 'total, sizes, prev, pager, next, jumper',
        total: 0,
        options2: [],
        downloadLoading: false,
        queryForm: {
          pageNum: 1,
          pageSize: 10,
          jobId: '', //赋值当前项的id
          leaderId: '', //所属领队id
          ischecked: '', //	否	0-未审核 1-审核通过 2-审核未通过
          leaderCheck: '',
          keyWord: '', //关键字
        },
        jobId: '', //赋值当前项的id
        leaderId: '', //领队id返回领队信息
        list: [],
        token: '',
        imageUrl: '',
        options3: [],
        form: {
          value: '',
          roleId: '',
        },
        activated() {
          if (this.$refs.MaskVideo.src) this.$refs.MaskVideo.play()
        },
        deactivated() {
          if (this.$refs.MaskVideo.src) this.$refs.MaskVideo.pause()
        },

        title: '',
        dialogFormVisible: false,
      }
    },
    created() {
      this.token = this.$store.getters['user/token']
    },
    methods: {
      async handleDownloadtwo() {
        if (this.multipleSelection.length) {
          const res = await jilu({
            exportData: '领队管理列表',
          })
          this.downloadLoading = true
          import('@/utils/excel').then((excel) => {
            const tHeader = [
              '职位标题',
              '职位内容',
              '联系人',
              '联系人手机号',
              '姓名',
              '领队经济人名称',
              '所属协作公司',
              '领队简介',
              '创建时间',
            ]
            const filterVal = [
              'jobHead',
              'jobInfo',
              'linkmans',
              'linkphone',
              'leaName',
              'leaNickName',
              'ofEnterprise',
              'leaderIntro',
              'createTime',
            ]
            const list = this.multipleSelection
            const data = this.formatJsontwo(filterVal, list)
            console.log(data)
            excel.export_json_to_excel({
              header: tHeader,
              data,
            })
            this.$refs.multipleTable.clearSelection()
            this.downloadLoading = false
          })
        } else {
          this.$baseMessage('请至少选择一行', 'error', 'vab-hey-message-error')
        }
      },
      formatJsontwo(filterVal, jsonData) {
        return jsonData.map((v) => filterVal.map((j) => v[j]))
      },
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
      async handleDownload() {
        const res = await jilu({
          exportData: '领队管理列表',
        })
        this.downloadLoading = true
        import('@/utils/excel').then((excel) => {
          const tHeader = [
            '职位标题',
            '职位内容',
            '联系人',
            '联系人手机号',

            '姓名',
            '领队经济人名称',
            '所属协作公司',
            '领队简介',
            '创建时间',
          ]
          const filterVal = [
            'jobHead',
            'jobInfo',
            'linkmans',
            'linkphone',

            'leaName',
            'leaNickName',
            'ofEnterprise',
            'leaderIntro',
            'createTime',
          ]

          const list = this.list
          const data = this.formatJson(filterVal, list)
          excel.export_json_to_excel({
            header: tHeader,
            data,
          })
          this.downloadLoading = false
        })
      },
      formatJson(filterVal, jsonData) {
        return jsonData.map((v) =>
          filterVal.map((j) => {
            return v[j]
          })
        )
      },
      handleEdittwo(row) {
        if (row.id) {
          this.$refs['Edittwo'].showEdit(row, this.jobId)
        } else {
          this.$refs['Edittwo'].showEdit()
        }
      },
      async chooseone(e) {
        // this.form.areaName = e.areaName
        // this.form.areaId = e.id
        this.queryForm.leaderId = this.form.roleId
        this.listLoading = true
        this.queryForm.pageNum = 1
        const res = await getlingduiList(this.queryForm)
        console.log(res)
        // this.list = res.data.dataList
        this.total = res.data.total
        this.listLoading = false
      },

      handleCurrentChange(val) {
        this.queryForm.pageNum = val
        this.showEdit()
      },
      handleSizeChange(val) {
        this.queryForm.pageSize = val
        this.showEdit()
      },
      setSelectRows(val) {
        this.selectRows = val
      },
      async showEdit(row) {
        console.log(row.id)
        this.listLoading = true
        this.jobId = row.id
        this.title = '领队管理列表'
        this.dialogFormVisible = true
        const res = await getlingduiList({
          jobId: this.jobId,
        })
        this.list = res.data
        this.listLoading = false
      },
      close() {
        let userId = this.form.userId
        // this.$refs['form'].resetFields()
        this.form = this.$options.data().form
        if (!this.form.id) {
          this.form.userId = userId
        }
        this.dialogFormVisible = false
        this.imageUrl = ''
        // this.form = ''
      },

      save() {
        this.$refs['form'].validate(async (valid) => {
          if (valid) {
            if (this.form.id) {
              const msg = doEdit(this.form)
              console.log(msg)
              this.$emit('fetch-data')
              this.close()
              msg.then((res) => {
                if (res.msg === '修改成功') {
                  this.$baseMessage(
                    res.msg,
                    'success',
                    'vab-hey-message-success'
                  )
                }
              })
            } else {
              const msg = doAdd(this.form)

              this.$emit('fetch-data')
              this.close()
              msg.then((res) => {
                if (res.msg === '添加成功') {
                  this.$baseMessage(
                    res.msg,
                    'success',
                    'vab-hey-message-success'
                  )
                  this.$router.push({
                    path: '/article/articlemanagement/articlelist',
                  })
                }
              })
            }
          }
        })
      },

      nickNameChange() {
        this.$forceUpdate()
      },
    },
  }
</script>
<style>
  .avatar-uploader .el-upload {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409eff;
  }
  .avatar-uploader-icon {
    width: 178px;
    height: 178px;
    font-size: 28px;
    line-height: 178px;
    color: #8c939d;
    text-align: center;
  }
  .avatar {
    display: block;
    width: 178px;
    height: 178px;
  }
  .baocun {
    width: 100%;
    height: 100%;
  }
</style>
